<template>
	<view>
		<text>aaaaa</text>
		<view>
			<view class="title">选择起点
				<input v-model="start" />
			</view>
			<view class="title">选择终点
				<input v-model="dest" />
			</view>
		</view>
		<map style="width: 100%;height: 300px;" :longitude="longitude" :latitude="latitude" scale="10"
			:polyline="polylines"></map>
	</view>
</template>

<script>
	import QQMap from '@/static/js/QQMap.js'
	export default {
		name: "my-map",
		data() {
			return {
				longitude: 0,
				latitude: 0,
				start: '',
				dest: '34.30,108.93',
				polylines: []
			};
		},
		created() {
			let that = this
			uni.getLocation({
				type: 'gcj02',
				geocode: true,
				success(res) {
					that.$data.latitude = res.latitude
					that.$data.longitude = res.longitude
					that.$data.start = res.latitude + ',' + res.longitude
					console.log(that.$data.start)
				}
			})
		},
		methods: {
			direction() {
				let that = this
				QQMap.qqmapsdk.direction({
					mode: 'bicycling', //可选值：'driving'（驾车）、'walking'（步行）、'bicycling'（骑行），不填默认：'driving',可不填
					//from参数不填默认当前地址
					from: that.$data.start,
					to: that.$data.dest,
					success: function(res) {
						let routes = res.result.routes
						for (let k = 0; k < routes.length; k++) {
							let polyline = {
								points: [],
								color: "#0055ff",
								width: 4,
								dottedLine: true,
							}
							let coors =res.result.routes[k].polyline
							let kr = 1000000
							for (var i = 2; i < coors.length; i++) {
								coors[i] = Number(coors[i - 2]) + Number(coors[i]) / kr;
							}
							//将解压后的坐标放入点串数组pl中
							for (var i = 0; i < coors.length; i += 2) {
								polyline.points.push({
									latitude: coors[i],
									longitude: coors[i + 1]
								})
							}
							that.$data.polylines.push(polyline)
						}
					},
					fail: function(error) {
						console.error(error)
					},
					complete: function(res) {
						console.log(res)
					}
				});
			}
		},
		watch: {
			// 起点值监控
			start(value) {
				if ('' != this.$data.dest) {
					this.direction()
				}
			},
			// 终点值监控
			dest(value) {
				if ('' != this.$data.start) {
					this.direction()
				}
			}
		}
	}
</script>

<style>

</style>
